<template>
    <div style="padding:15px;background:#fff;border-radius: 10px;">
            <el-table
                class="custom-table"
                ref="multipleTable"
                :data="objectivequestionslist"
                tooltip-effect="dark"
                style="width: 100%"
                stripe
                @selection-change="handleSelectionChange"
                :header-cell-style="{ background: '#D8E4F0', color: '#2A303B',fontWeight:'500' }">
                <el-table-column
                    type="selection"
                    width="55">
                </el-table-column>
                <el-table-column
                    label="试号">
					<template slot-scope="scope">
						{{ scope.$index+1 }}
					</template>
                </el-table-column>
                <el-table-column
                    prop="pressnum"
                    label="试题编号">
                </el-table-column>
                <el-table-column
                    label="题型名称"
                    prop="typename">
                </el-table-column>
                <el-table-column
                    label="满分"
                    prop="highestscore">
                </el-table-column>
                <el-table-column
                    label="标准答案">
					<template slot-scope="scope">
					 	{{scope.row.answer?scope.row.answer:'-'}}
					</template>
                </el-table-column>
                <el-table-column
                    label="试题规则">
					<template slot-scope="scope">
					 -
					</template>
                </el-table-column>
                <el-table-column
                    fixed="right"
                    label="操作"
                    align="center"
                    width="200">
                    <template slot-scope="scope">
                        <div style="display: flex;" class="scopednr">
                            <!-- <b @click="editExamschool1(scope.row)">查看小图</b> -->
                            <b @click="editExamschool(scope.row)">编辑</b>
                            <b @click="dgdeletequestion(scope.row.pressflagid)">删除</b>
                        </div>
                    </template>
                </el-table-column>
            </el-table>
            <div v-if="functionButton" class="examfooter">
                <div class="examFootercontent">
                    <div>
                        <span class="totaldata">共<i>{{multipleSelection.length}}</i>条数据</span>
						<el-button style="background:#165DFF;color:#fff;margin-left:20px;border-color:#165DFF;" @click="addtateobjective">新增客观题</el-button>
                        <el-button style="background:#D54941;color:#fff;margin-left:20px;border-color:#D54941;" @click="batchDeletateobjective">批量删除</el-button>
                    </div>
                </div>
            </div>
            <!-- 编辑客观题 -->
            <div class="addExamMain" v-if="editobjectivequestions">
                <div class="addExamContent">
                    <h3 style="padding-bottom:10px;">编辑客观题-{{objdetailinfo.questionNumber}}</h3>
                    <div style="color:rgb(236, 85, 90);font-size:14px;padding-bottom :14px;">
                        注意：目前该题号与试卷模板客观题题号对比缺少4，如试题管理与试卷模板题号不配时会造成不能开启扫描状态，如需继续保存请再次点击保存按钮。
                    </div>
                    <block>
                        <p style="padding-bottom:15px;font-size:14px;">编辑客观题信息</p>
                        <ul class="muchcommentlist">
                            <li>
                                <span style="width:120px;">试题编号：</span>
                                <el-input v-model="objdetailinfo.pressnum"></el-input>
                            </li>
                            <!-- <li>
                                <span style="width:97spx;">题型名称：</span>
                                <el-select v-model="objdetailinfo.questionRules" placeholder="请选择" class="selectbox">
                                    <el-option
                                        v-for="item in questionclassifylist"
                                        :key="item.id"
                                        :label="item.name"
                                        :value="item.id">
                                    </el-option>
                                </el-select>
                            </li> -->
                            <li>
                                <span style="width:120px;">满分：</span>
                                <el-input v-model="objdetailinfo.highestscore"></el-input>
                            </li>
                            <li style="color:red;" v-if="attentionIshow">
                                <i class="el-icon-warning-outline" style="margin-right:5px;"></i>{{attention}}
                            </li>
                        </ul>
                        <p style="padding-bottom:15px;font-size:14px;">设置答案</p>
                        <ul class="muchcommentlist">
                            <li>
                                <span style="width:120px;">标准答案：</span>
                                <el-input v-model="objdetailinfo.answer" @input="objdetailinfo.answer = onlyLetters(objdetailinfo.answer)"></el-input>
                            </li>
                            <li><em style="color:#D54941">修改正确答案后，如已发布成绩请取消重新发布并运算数据分析。</em></li>
                            <li style="color:red;" v-if="attentionIshow">
                                <i class="el-icon-warning-outline" style="margin-right:5px;"></i>{{attention}}
                            </li>
                        </ul>	
                    </block>
                    <div class="groupbutton">
                        <el-button type="primary" @click="editobjectivequestionssurebc">保存</el-button>
                        <el-button type="primary" @click="editobjectivequestionsgoback">返回</el-button>
                    </div>
                </div>
            </div>
			<!-- 新增客观题  -->
			<div class="objsubMain" v-if="addobjquestionIshow">
				<div class="objsubContent">
					<h3>新增客观题</h3>
					<div class="objsubattention">
						<span>注意：</span>
						<p>单选提、判断题、多选题使用英文逗号（ , ）进行分隔。（单选示例：A,B,C 判断示例：T,F,T 多选示例：AB,AC,CD）。</p>
					</div>
					<div class="gundongtiaotable">
						<el-table
							class="custom-table"
							ref="multipleTable1"
							:data="objquestionlist"
							tooltip-effect="dark"
							style="width: 100%"
							@selection-change="handleSelectionChange1"
							:row-style="getRowStyle"
							:header-cell-style="{ background: '#D8E4F0', color: '#2A303B',fontWeight:'500' }">
							<el-table-column
							label="题型"
								width="120">
							<template slot-scope="scope">
								<el-select v-model="scope.row.type" placeholder="请选择" class="selectbox">
									<el-option
										v-for="item in questionclassifylist"
										:key="item.value"
										:label="item.name"
										:value="item.value">
									</el-option>
									</el-select>
							</template>
							</el-table-column>
							<el-table-column
							label="起止题号">
							<template slot-scope="scope">
								<div style="display: flex;align-items: center;">
									<!-- <div style="display:none;">{{errorRows[scope.$index]}}</div> -->
									<el-input class="fxwidth" v-model="scope.row.startNum" @input="scope.row.startNum = onlyzzNumber(scope.row.startNum)" placeholder="" ></el-input>
									- 
									<el-input class="fxwidth" v-model="scope.row.endNum" @input="scope.row.endNum = onlyzzNumber(scope.row.endNum)" placeholder=""></el-input>
								</div>
							</template>
							</el-table-column>
							<el-table-column
								label="满分">
								<template slot-scope="scope">
									<el-input v-model="scope.row.highestscore" @input="scope.row.highestscore = onlyNumber(scope.row.highestscore)" placeholder="" class="fxwidth" ></el-input>
								</template>
							</el-table-column>
							<el-table-column
							label="答案">
							<template slot-scope="scope">
								<el-input  v-model="scope.row.answers" placeholder="" class="answerwidth" @input="scope.row.answer = onlyLetters(scope.row.answer)"></el-input>
							</template>
							</el-table-column>
							<!-- <el-table-column
								fixed="right"
								label="操作"
								align="center"
								width="140">
								<template slot-scope="scope">
									<div style="display: flex;">
										<el-button type="text" size="small" @click="deleteobjquestion(scope.$index)" style="display: flex;align-items: center;color:#EC555A">删除</el-button>
										<el-button @click="addobjsubet(scope.row)" v-if="scope.$index == objquestionlist.length - 1" type="text" size="small" style="display: flex;align-items: center;">新增</el-button>
									</div>
								</template>
							</el-table-column> -->
						</el-table>
					</div>
					<!-- <div style="color:rgb(236, 85, 90);font-size:14px;padding-top:14px;">
						注意：新增客观题题号与试卷模板客观题题号对比缺少21/23/25，如试题管理与试卷模板题号不配时会造成不能开启扫描状态，如需继续保存请再次点击保存按钮。
					</div> -->
					<div class="exambutton">
						<span @click="sureobj">保存</span>
						<span @click="cancelobj">取消</span>
					</div>
				</div>
			</div>
        </div>
</template>

<script>
import {batchdeleteobjetive,addobjectquestion,editupdatePressFlag} from '../../api/api.js'
export default {
	props:['objectivequestionslist','questiontid','modellist'],
    data() {
        return {
            multipleSelection: [],
			editobjectivequestions:false,
			addobjquestionIshow:false,
			objdetailinfo:{
				pressflagid:'',
				pressnum:'',
				highestscore:'',
				answer:''
			},
			functionButton: true,
			questionclassifylist:[{name:'单选题',value:1},{name:'多选题',value:2}],
			objquestionlist:[
				{
					type:1,
					itemCaseflagid:'',
					startNum:'',
					endNum:'',
					highestscore:'',
					answers:'',
				},
			],
        }
    },
	watch: {
		modellist: {
			handler(newVal, oldVal) {
				if (newVal.length > 0) {
					this.functionButton = true
				} else {
					this.functionButton = false
				}
			},immediate: true,deep: true
		}
	},
	methods: {
		// 格式化输入值
		formatInputValue(value) {
			        return value === 0 ? '' : value;
			    },
			onlyLetters(value) {
			  return value.replace(/[^a-zA-Z,]/g, '');
			},
			onlyNumber(value) {
			  return value.replace(/[^0-9.]/g, '');
			},
			onlyzzNumber(value) {
			  return value.replace(/[^0-9]/g, '');
			},
		//编辑客观题
		editExamschool(con){
			this.editobjectivequestions = true
			this.objdetailinfo.pressflagid = con.pressflagid
			this.objdetailinfo.pressnum = con.pressnum
			this.objdetailinfo.highestscore = con.highestscore
			this.objdetailinfo.answer = con.answer
		},
		editobjectivequestionssurebc(){
			console.info(this.objdetailinfo,'this.objdetailinfo')
			editupdatePressFlag(this.objdetailinfo).then(res=>{
			    if(res.code == 0){
					this.editobjectivequestions = false
			        this.$emit('updateobjectivequestionssurebc',false)
			    }else{
			        this.$message({
			            message: res.msg,
			            type: 'error'
			        })
			    }
			})
		},
		editobjectivequestionsgoback(){
			this.editobjectivequestions = false
			this.$emit('updateobjectivequestionssurebc',false)
		},
	    handleSelectionChange(val) {
			this.multipleSelection = val;
	    },
		getRowStyle({ rowIndex }) {
			    return {
			      backgroundColor: rowIndex % 2 === 1 ? '#FAFAFB' : '#ffffff'
			    };
			  },
			  handleSelectionChange1(val) {
				this.multipleSelection1 = val;
			},
			sureobj(){
				// this.objquestionlist.forEach(item=>{
				//     item.itemCaseflagid = this.questiontid
				// })
				this.objquestionlist[0].itemCaseflagid=this.questiontid
				addobjectquestion(this.objquestionlist[0]).then(res=>{
				    if(res.code==0){
						this.$message({
							type:'success',
							message: res.msg
						});
						this.addobjquestionIshow = false
						this.$emit('emitobjectivequestion',1)
					}else{
						this.$message({
							type:'error',
							message: res.msg
						});
					}
				})
				console.info(this.objquestionlist,'this.objquestionlist')
			},
			cancelobj(){this.addobjquestionIshow = false},
			addtateobjective(){this.addobjquestionIshow = true},
		//批量删除
		batchDeletateobjective(){
			let ids = this.multipleSelection.map(item=>item.pressflagid)
		    // sourceflagids
			if(ids.length==0){
				this.$message({
					type:'error',
					message: '请选择要删除的题目!'
				});
				return
			}
			let obj={
				pressflagids:ids
			}
			console.info('ids',ids)
			this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				batchdeleteobjetive(obj).then(res=>{
					if(res.code==0){
						this.$emit('emitobjectivequestion',1)
						this.$message({
							type:'success',
							message: '删除成功!'
						});
					}
				})
			}).catch(() => {
				this.$message({
					type: 'info',
					message: '已取消删除'
				});          
			});
		},
		// 单个删除
		dgdeletequestion(id){
			this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				let obj={
					pressflagids:[id]
				}
				batchdeleteobjetive(obj).then(res=>{
					if(res.code==0){
						this.$emit('emitobjectivequestion',1)
						this.$message({
							type:'success',
							message: '删除成功!'
						});
					}
				})
			}).catch(() => {
				this.$message({
					type: 'info',
					message: '已取消删除'
				});          
			});
		}
	}
}
</script>

<style scoped>
.custom-table {
	  width: 100%;
	  border: 1px solid rgba(216,228,240,0.34);
	  border-radius:10px;
	  border-right: none;
	  border-bottom:none;
	}
	
	/* 自定义表格内部元素的样式 */
	.custom-table >>> .el-table__header-wrapper th {
	  background-color: #E8F0FA;
	  height:42px;
	  padding:0;
	  text-align: center;
	  font-weight:normal
	}
	.custom-table >>> .el-table__row td {
	  height:42px;
	  padding:0;
	  text-align: center;
	  border-bottom:none;
	  border-right:solid 1px rgba(216,228,240,0.34);
	  font-size:14px;
	}
	.el-table .warning-row {
	    background: #ffffff;
	 }
	.el-table .success-row {
	    background: #D8E4F0;
	}
     .el-table .el-table__cell{
        padding:8px 0;
    }
    .examfooter{
		width:100%;
		height:54px;
		left:0;
		bottom:0;
	}
	.examFootercontent{
		margin:0 auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.examFootercontent .totaldata{
		font-size:14px;
	}
	.examFootercontent .totaldata i{
		display: inline-block;
		color:#295CFF;
		font-style: normal;
		line-height:54px;
		padding:0 3px;
	}
    .scopednr b{
        display: inline-block;
        font-weight:normal;
        margin:0 8px;
        color:#165DFF;
        cursor: pointer;
    }
    .scopednr b:last-child{
        color:#D54941
    }
    .addExamMain{
		position: fixed;
		width:100%;
		height:100%;
		background:rgba(0,0,0,0.5);
		left:0;
		top:0;
		z-index:5;
	}
	.addExamContent{
		width: 584px;
		height: auto;
		background: #FFFFFF;
		box-shadow: 0px 4px 16px 0px rgba(85,114,146,0.1);
		border-radius: 10px;
		position: fixed;
		left:50%;
		top:50%;
		transform: translate(-50%,-50%);
		z-index:2;
		box-sizing: border-box;
		padding:30px;
	}
	.addExamContent h3{
		font-size:18px;
		padding-bottom:20px;
	}
	.addExamContent ul.muchcommentlist li{
		display: flex;
		align-items: center;
		padding-bottom:14px;
		font-size:14px;
	}
	.addExamContent ul.muchcommentlist li span{
		font-size:14px;
		width:98px;
		color: #557292;
		text-align: right;
	}
	.addExamContent ul.muchcommentlist li p{
		position: relative;
	}
	.addExamContent ul.muchcommentlist li p em{
		position: absolute;
		right:10px;
		top:50%;
		transform: translateY(-50%);
		color:#C0C4CC;
		cursor: pointer;
	}
	.addExamContent ul.muchcommentlist li >>>.el-input__inner{
		width: 400px;
		height: 34px;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
	}
	.inputBox{
		width: 400px;
	}
	.inputBox1{
		width: 300px;
	}
	.addExamContent ul.muchcommentlist li div.inputBox1 >>> .el-input__inner{
		width:300px;
		height: 34px;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
	}
	.addExamContent ul.muchcommentlist li >>> .el-range__icon{
		line-height:27px;
	}
	.groupbutton{
		display: flex;
		align-items: center;
		padding-top:20px;
	}
	.groupbutton >>> .el-button{
		width: 124px;
		height: 34px;
		background: #295CFF;
		border-radius: 10px;
		font-size: 14px;
		color: #FFFFFF;
		padding:0;
	}
	.groupbutton >>> .el-button:last-child{
		background: #F2F6FB;
		border-radius: 10px;
		border: 1px solid #295CFF;
		color:#295CFF;
		margin-left:24px;
	}
	.bcontentcolor{
		font-size:14px;
		color:#295CFF;
		display: inline-block;
		margin-left:20px;
		cursor: pointer;
	}
	.el-checkbox{
		margin-right:8px;
	}
	.infosetcontentfont{
		color:#5B6371
	}
	.addExamContent ul.muchcommentlist li.infosetcontentfont span{
		width:auto;
		height: 26px;
		border-radius: 4px;
		border: 1px solid #D8E4F0;
		color:#B3B8C2;
		font-size:14px;
		text-align:left;
		line-height:26px;
		padding:0 16px 0 10px;
		margin-left:10px;
	}
	.addExamContent ul.muchcommentlist li.infosetcontentfont i{
		font-style:normal;
		color:#295CFF;
		padding:0 4px;
	}
	.objsubMain{
		position:fixed;
		left:0;
		top:0;
		width:100%;
		height:100%;
		background:rgba(0,0,0,0.75);
		z-index:100;
	}
	.objsubContent{
		box-sizing: border-box;
		width: 1040px;
		max-height: 600px;
		background: #FFFFFF;
		box-shadow: 0px 4px 16px 0px rgba(85,114,146,0.1);
		border-radius: 10px;
		position: fixed;
		left:50%;
		top:50%;
		transform: translate(-50%,-50%);
		padding:24px;
	}
	.objsubContent h3{
		font-size:18px;
		font-weight: normal;
	}
	.objsubattention{
		display: flex;
		font-size:14px;
		color:#619CF5;
		padding:10px 0 24px;
	}
	.gundongtiaotable{
		width:100%;
		height:360px;
		overflow-y: auto;
		overflow-x: hidden;
	}
	.gundongtiaotable::-webkit-scrollbar {
		width:6px;
		background-color: #eee;
		border-radius:10px;
	}
	.gundongtiaotable::-webkit-scrollbar-track {
		background-color: #eee;
		border-radius:10px;
	}
	.gundongtiaotable::-webkit-scrollbar-thumb {
		background: #619CF5;
		border-radius: 10px;
	}
	.fxwidth{
		font-size:14px;
		color:#2A303B;
	}
	.fxwidth >>> .el-input__inner{
		width: 35px;
		height: 30px;
		background: #F2F6FB;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
		padding:0;
		text-align: center;
	}
	.answerwidth >>> .el-input__inner{
		width: 156px;
		height: 30px;
		background: #F2F6FB;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
		padding:0 10px
	}
	.selectbox >>> .el-input__inner{
		width: 86px;
		height: 30px;
		/* background: #F2F6FB; */
		border-radius: 10px;
		border: 1px solid #D8E4F0;
		color:#2A303B;
		padding:0 8px;
	}
	.selectbox >>> .el-input__icon{
		line-height:30px;
	}
	.exambutton{
		display: flex;
		align-items: center;
		margin-top:24px;
	}
	.exambutton span{
		width: 124px;
		height: 34px;
		border-radius: 10px;
		font-size: 14px;
		text-align: center;
		line-height:34px;
		cursor: pointer;
	}
	.exambutton span:first-child{
		background: #295CFF;
		color:#fff;
		margin-right:24px;
	}
	.exambutton span:last-child{
		background: #F2F6FB;
		border: 1px solid #295CFF;
		color:#295CFF;
	}
	.input-error >>> .el-input__inner{
		border:#EC555A solid 1px;
	}
	
	.objsubContent table{
		border-radius: 10px;
		border: 1px solid rgba(216,228,240,0.5);
	}
	.objsubContent table tr th{
		font-size:14px;
		font-weight:normal;
		background:#E8F0FA;
		height:42px;
	}
	.objsubContent table tr th:first-child{
		border-radius: 8px 0 0 0;
	}
	.objsubContent table tr th:last-child{
		border-radius: 0 8px 0 0;
	}
	.objsubContent table tr td{
		height:42px;
		text-align: center;
		font-size:14px;
		border-right:solid 1px rgba(216,228,240,0.34);
	}
	.objsubContent table tr td:last-child{
		border-right:none;
	}
	.objsubContent table tr td i{
		display: block;
		font-style: normal;
		font-size:12px;
		color:#999
	}
	.objsubContent table tr td em{
		display: block;
	}
	.objsubContent table tr td span{
		position:relative;
		display: inline-block;
		cursor: pointer;
	}
	.objsubContent table tr td span em{
		font-size:12px;
		font-style:normal;
	}
	.objsubContent table tr td span::after{
		content:'';
		width: 43px;
		height: 1px;
		position:absolute;
		left:50%;
		bottom:-4px;
		transform: translateX(-50%);
		background:#000;
	}
	.objsubContent table tr td span.green{
		color:#288F41
	}
	.objsubContent table tr td span.green::after{
		content:'';
		width: 43px;
		height: 1px;
		position:absolute;
		left:50%;
		bottom:-4px;
		transform: translateX(-50%);
		background:#288F41;
	}
	.objsubContent table tr td span.blue{
		color:#295CFF
	}
	.objsubContent table tr td span.blue::after{
		content:'';
		width: 43px;
		height: 1px;
		position:absolute;
		left:50%;
		bottom:-4px;
		transform: translateX(-50%);
		background:#295CFF;
	}
	.objsubContent table tr td span.red{
		color:#EC555A
	}
	.objsubContent table tr td span.red::after{
		content:'';
		width: 43px;
		height: 1px;
		position:absolute;
		left:50%;
		bottom:-4px;
		transform: translateX(-50%);
		background:#EC555A;
	}
	.objsubContent table tr td span.gray{
		color:#D8E4F0
	}
	.objsubContent table tr td span.gray::after{
		content:'';
		width: 43px;
		height: 1px;
		position:absolute;
		left:50%;
		bottom:-4px;
		transform: translateX(-50%);
		background:#D8E4F0;
	}
	.objsubContent table tr:nth-child(3n){
		background:#FAFAFB
	}
	
	
	
	.addExamMain{
		position: fixed;
		width:100%;
		height:100%;
		background:rgba(0,0,0,0.5);
		left:0;
		top:0;
		z-index:5;
	}
	.addExamContent{
		width: 584px;
		height: auto;
		background: #FFFFFF;
		box-shadow: 0px 4px 16px 0px rgba(85,114,146,0.1);
		border-radius: 10px;
		position: fixed;
		left:50%;
		top:50%;
		transform: translate(-50%,-50%);
		z-index:2;
		box-sizing: border-box;
		padding:30px;
	}
	.addExamContent h3{
		font-size:18px;
		padding-bottom:20px;
	}
	.addExamContent ul.muchcommentlist li{
		display: flex;
		align-items: center;
		padding-bottom:14px;
		font-size:14px;
	}
	.addExamContent ul.muchcommentlist li span{
		font-size:14px;
		width:98px;
		color: #557292;
		text-align: right;
	}
	.addExamContent ul.muchcommentlist li p{
		position: relative;
	}
	.addExamContent ul.muchcommentlist li p em{
		position: absolute;
		right:10px;
		top:50%;
		transform: translateY(-50%);
		color:#C0C4CC;
		cursor: pointer;
	}
	.addExamContent ul.muchcommentlist li >>>.el-input__inner{
		width: 400px;
		height: 34px;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
	}
	.inputBox{
		width: 400px;
	}
	.inputBox1{
		width: 300px;
	}
	.addExamContent ul.muchcommentlist li div.inputBox1 >>> .el-input__inner{
		width:300px;
		height: 34px;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
	}
	.addExamContent ul.muchcommentlist li >>> .el-range__icon{
		line-height:27px;
	}
	.groupbutton{
		display: flex;
		align-items: center;
		padding-top:20px;
	}
	.groupbutton >>> .el-button{
		width: 124px;
		height: 34px;
		background: #295CFF;
		border-radius: 10px;
		font-size: 14px;
		color: #FFFFFF;
		padding:0;
	}
	.groupbutton >>> .el-button:last-child{
		background: #F2F6FB;
		border-radius: 10px;
		border: 1px solid #295CFF;
		color:#295CFF;
		margin-left:24px;
	}
	.bcontentcolor{
		font-size:14px;
		color:#295CFF;
		display: inline-block;
		margin-left:20px;
		cursor: pointer;
	}
	.el-checkbox{
		margin-right:8px;
	}
	.infosetcontentfont{
		color:#5B6371
	}
	.addExamContent ul.muchcommentlist li.infosetcontentfont span{
		width:auto;
		height: 26px;
		border-radius: 4px;
		border: 1px solid #D8E4F0;
		color:#B3B8C2;
		font-size:14px;
		text-align:left;
		line-height:26px;
		padding:0 16px 0 10px;
		margin-left:10px;
	}
	.addExamContent ul.muchcommentlist li.infosetcontentfont i{
		font-style:normal;
		color:#295CFF;
		padding:0 4px;
	}
	.tabletabcopy{
		display: flex;
		align-items: center;
		width: 252px;
		height: 30px;
		background: rgba(41,92,255,0.06);
		border-radius: 4px;
		border: 1px solid #295CFF;
	}
	.tabletabcopy li{
		width:84px;
		border-right:solid 1px #295CFF;
		line-height:30px;
		font-size:14px;
		color:#295CFF;
		text-align: center; 
		cursor: pointer;
	}
	.tabletabcopy li:last-child{
		border-right:none;
	}
	.tabletabcopy li.hover,.tabletabcopy li:hover{
		background:#295CFF;
		color:#fff;
	}
	.copyexamcontent{
		height:300px;
		overflow-y: auto;
		overflow-x: hidden;
	}
	.copyexamcontent::-webkit-scrollbar {
		 width:4px;
		background-color: #eee;
		border-radius:10px;
	}
	.copyexamcontent::-webkit-scrollbar-track {
		background-color: #eee;
		border-radius:10px;
	}
	.copyexamcontent::-webkit-scrollbar-thumb {
		background: #619CF5;
		border-radius: 10px;
	}
	.copyexamcontent ul{
		
	}
	.copyexamcontent ul li{
		padding:24px 0;
		border-bottom:solid 1px #EFF1F4;
		cursor: pointer;
	}
	.copyexamcontent ul li div{
		font-size:16px;
		color:#2A303B;
	}
	.copyexamcontent ul li div span{
		color:#557292;
		font-size:12px;
		padding-left:8px;
	}
	.copyexamcontent ul li p{
		font-size:14px;
		color:#295CFF;
		padding-top:10px;
	}
	.copyexamcontent ul li p em{
		font-style: normal;
		margin-right:10px;
	}
	.addExamContent >>> .el-upload-dragger{
		width:522px;
	}
	.uploadbox{
		width:522px;
		height:220px;
		position:relative;
	}
	.uploadbox a{
		position:absolute;
		right:0;
		bottom:10px;
		font-size:14px;
		color:#295CFF;
	}
	.tablebox{
		width:100%;
		background: #FFFFFF;
		box-shadow: 0px 4px 16px 0px rgba(85,114,146,0.1);
		border-radius: 10px;
	}
	.tableboxtitle{
		display: flex;
		align-items: center;
		height:42px;
		background:#E8F0FA;
		border-radius:10px 10px 0 0;
	}
	.tableboxtitle li{
		line-height:42px;
		text-align:center;
		font-size:14px;
		color:#2A303B;
		border-right: 1px solid rgba(216,228,240,0.34);
	}
	.tableboxtitle li:first-child{
		border-radius: 10px 0 0 0;
	}
	.tableboxtitle li:last-child{
		border-radius: 0 10px 0 0;
		border-right: none
	}
	.tableboxcontent{
		width:100%;
	}
	.tableboxcontent li:nth-child(2n){
		background: #FAFAFB;
	}
	.bigquestion{
		display: flex;
		align-items: center;
	}
	.tabletrtd{
		display:flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		height:42px;
		border-right:1px solid rgba(216,228,240,0.34)
	}
	.bigquestion div.tabletrtd:last-child{
		border-right: none
	}
	.addExamContent ul.muchcommentlist li .classobxst >>> .el-input__inner{
		width:150px;
	}
	.yes{
		cursor: pointer;display: inline-block;width: 43px;height: 30px;border-radius:10px;background:#EDF4F0;border:solid 1px #53A667;font-size:14px;
		color:#53A667;font-style:normal;line-height:30px;
	}
	.no{
		cursor: pointer;display: inline-block;width: 43px;height: 30px;border-radius:10px;background:#FEF5F5;border:solid 1px #EC555A;font-size:14px;
		color:#EC555A;font-style:normal;line-height:30px;
	}
	.boxsetscorll{
		height:390px;
		overflow-x: hidden;
		overflow-y: auto;
	}
	.boxsetscorll::-webkit-scrollbar {
		 width:6px;
		background-color: #eee;
		border-radius:10px;
	}
	.boxsetscorll::-webkit-scrollbar-track {
		background-color: #eee;
		border-radius:10px;
	}
	.boxsetscorll::-webkit-scrollbar-thumb {
		background: #619CF5;
		border-radius: 10px;
	} 
	.breadBox >>> .el-breadcrumb__inner a,.breadBox >>> .el-breadcrumb__inner.is-link{
		font-weight:normal
	}
	.breadBox >>> .el-breadcrumb__item:last-child .el-breadcrumb__inner,
	.breadBox >>> .el-breadcrumb__item:last-child .el-breadcrumb__inner a,
	.breadBox >>> .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover,
	.breadBox >>> .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover{
		font-weight:bold
	}	
</style>